<template>
  <div class="home">
    <div class="header" @click="toLogin">
      <img src="@/assets/images/User/user.jpg" />
      <div class="txt">登录/注册</div>
    </div>
    <div class="content">
      <div class="content1">
        <van-cell title="我的订单" is-link value="全部订单" />
        <div class="content1_item">
          <div class="item">
            <div class="icon iconfont icon-daifukuan"></div>
            <div class="txt">待付款</div>
          </div>
          <div class="item">
            <div class="icon iconfont icon-daishouhuo"></div>
            <div class="txt">待收货</div>
          </div>
          <div class="item">
            <div class="icon iconfont icon-banshou"></div>
            <div class="txt">退换修</div>
          </div>
        </div>
      </div>
      <div class="content2">
        <div class="cell_item">
          <div class="cell">
            <div class="icon iconfont icon-huangguan"></div>
            <van-cell title="会员中心" is-link class="border" />
          </div>
          <div class="cell">
            <div class="icon iconfont icon-youhuiquan"></div>
            <van-cell title="我的优惠" is-link />
          </div>
        </div>
        <div class="cell_item">
          <div class="cell">
            <div class="icon iconfont icon-fuwu"></div>
            <van-cell title="服务中心" is-link class="border" />
          </div>
          <div class="cell">
            <div class="icon iconfont icon-shangdian"></div>
            <van-cell title="小米之家" is-link />
          </div>
        </div>
        <div class="cell_item">
          <div class="cell">
            <div class="icon iconfont icon-F"></div>
            <van-cell title="我的F码" is-link class="border" />
          </div>
          <div class="cell">
            <div class="icon iconfont icon-liwu"></div>
            <van-cell title="礼物码兑换" is-link />
          </div>
        </div>
        <div class="cell cell_item">
          <div class="icon iconfont icon-shezhi"></div>
          <van-cell title="设置" is-link />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
  methods: {
    toLogin() {
      this.$router.push('/login')
    },
    getUserInfo(event) {
      console.log(event.detail)
    },

    onClose() {
      this.setData({ close: false })
    }
  }
}
</script>
<style scoped>
.home {
  background: rgb(244, 244, 244);
}
.header {
  background: url('../../assets/images/User/bg.jpg');
  height: 3rem;
  width: 100%;
  display: flex;
  align-items: center;
}
.header img {
  border-radius: 50%;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.6rem;
}
.header .txt {
  margin-left: 0.4rem;
  color: #fff;
  font-size: 0.5rem;
}
.content {
  padding-bottom: 2rem;
}
.content1 .van-cell {
  border-bottom: 0.01rem solid #ccc;
}
.content1_item {
  height: 3.2rem;
  width: 100%;
  background: #fff;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.content1_item .item {
  font-size: 0.42rem;
  color: #000;
}
.border {
  border-bottom: 0.01rem solid #ccc;
}
.content2 .cell_item {
  margin-top: 0.4rem;
}
.content2 .cell {
  display: flex;
}
.content2 .cell .icon {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content2 .cell .van-cell {
  flex: 5;
  height: 2rem;
}
</style>
